<template>
    <div class="row-image-2">
         <div class="row-image">
            <a href="#" class="item">
                <img :src="rowImage2Url" alt="">
            </a>
        </div>
        <div class="row-three-box">
            <div class="row-image row-left">
                <a href="#" class="item">
                    <img :src="rowThreeBoxImage1" alt="">
                </a>
            </div>
            <div class="row-right">
                <div class="row-image right-top">
                    <a href="#" class="item">
                        <img :src="rowThreeBoxImage2" alt="">
                    </a>
                </div>           
                <div class="row-image right-bottom">
                    <a href="#" class="item">
                        <img :src="rowThreeBoxImage3" alt="">
                    </a>
                </div>           
            </div>
        </div>
        <div class="row-image young-image">
            <a href="#" class="item young-left">
                <img :src="youngImage1" alt="">
            </a>
            <!-- <a href="#" class="item young-right">
                <img :src="youngImage2" alt="">
            </a> -->
        </div>
        <!-- <div class="row-two-ad">
            <div class="row-image row-left">
                <a href="#" class="item">
                    <img :src="rowTwoAd1" alt="">
                </a>
            </div>
            <div class="row-image row-right">
                    <a href="#" class="item">
                        <img :src="rowTwoAd2" alt="">
                    </a>          
            </div>
        </div> -->
        <!-- <div class="row-image">
            <a href="#" class="item">
                <img src="https://haitao.nosdn1.127.net/TIXNA7QlO3mCB1Tr960T18070101405_960_97.png?imageView&type=webp&thumbnail=960x97&quality=95" alt="">
            </a>
        </div> -->

    </div>

</template>
<script>
    import {mapActions,mapGetters,mapMutations,mapState} from "vuex"
    export default {
        computed: {
            ...mapGetters("Home",[
                "rowImage2Url",
                "rowThreeBoxImage1",
                "rowThreeBoxImage2",
                "rowThreeBoxImage3",
                "youngImage1",
                "youngImage2",
                "rowTwoAd1",
                "rowTwoAd2",
            ])
        },

    }
</script>

<style lang="stylus" scoped>
    .row-image-2
        .row-three-box
            display flex
            justify-content space-between
            .row-left
                width 50%
                height 1.876rem
            .row-right
                width 50%
                height 1.876rem
                a
                    height .938rem
        .young-image
            display flex
            
            .young-left
                width 100%
            // .young-right 
            //     width 50%
        .row-two-ad
            display flex
            justify-content space-between
            height .7191rem
            .row-left
                width 50%
            .row-right
                width 50%





</style>